<template>
	<view class="content">
		<view class="title">
			开设选课
		</view>

		<view class="list">
			<u--form labelPosition="top" :model="model" labelWidth="auto">
				<u-form-item label="最大人数:" prop="model.number" borderBottom ref="item1">
					<u--input v-model="model.number" border="2px" placeholder="设置最大人数"></u--input>
				</u-form-item>

				<u-form-item label="选课期限:" prop="" borderBottom ref="item1">
					<view class="example-body">
						<uni-datetime-picker v-model="model.range" type="datetimerange" @maskClick="maskClick" />
					</view>
				</u-form-item>
				<u-form-item label="上课地点:" prop="model.address" borderBottom ref="item1">
					<u--input v-model="model.address" border="2px" placeholder="输入上课地点"></u--input>
				</u-form-item>
				<u-form-item label="上课时间:" prop="model.time" borderBottom ref="item1"
					@click="show = true; hideKeyboard()">
					<u--input v-model="model.time" border="2px" placeholder="选择上课时间"></u--input>
					<u-picker :show="show" ref="uPicker" :columns="columns" @confirm="confirm" @cancel="show=false">
					</u-picker>

				</u-form-item>


				<u-button type="error" @click="submit">提交</u-button>
			</u--form>
		</view>
	</view>
</template>

<script>
	let now = new Date();

	export default {
		data() {

			return {
				teacherId: "",
				courseId: "",
				model: {
					number: 30,
					address: "",
					time: "",
					range: ['', ''],
					selectIndex: []
				},

				show: false,
				columns: [
					['星期一', '星期二', '星期三', '星期四', '星期五'],
					['1-2节', '3-4节', '5-6节', '7-8节', '9-10节']
				],

			}

		},

		methods: {
			hideKeyboard() {
				uni.hideKeyboard()
			},
			maskClick(e) {
				console.log('maskClick事件:', e);
			},
			confirm(e) {
				// this.time = e.
				console.log(e)
				this.model.time = e.value[0] + " " + e.value[1]
				this.model.selectIndex = e.indexs
				this.show = false
			},
			submit() {
				console.log(this.model)

				let data = {
					teacher_id: this.teacherId,
					course_id: this.courseId,
					max_num: this.model.number,
					start_time: this.model.range[0],
					end_time: this.model.range[1],
					address: this.model.address,
					time: this.model.time,
				}
				let token = uni.getStorageSync("token")
				uni.request({
					url: "http://127.0.0.1:8000/selects/",
					method: 'POST',
					header: {
						'Authorization': 'JWT ' + token // 参数
					},
					data: data,
					success: (res) => {
						console.log(res)
						if (res.data.code == 1) {
							uni.showModal({
								content: "添加成功",
								showCancel: false,
								success() {
									uni.switchTab({
										url: './home'
									})
								}
							})
						}
					},
					fail(err) {
						console.log(err)
					}
				})
			}
		},
		onLoad(options) {
			this.courseId = options['courseId']
			this.teacherId = options['teacherId']

		}
	}
</script>

<style lang="scss">
	.title {
		height: 100px;
		line-height: 100px;
		background-color: #a62618;
		text-align: center;
		color: white;
		font-size: 25px;
	}

	.list {
		margin: 10px;
	}
</style>
